.hidden{
    display:none;
}

#container{
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
}

#monopoly-frame{
    top:0;
    left:0;
    height:99%;
    width:99%;
    position:absolute;
    border:1px solid #000;
    background:#CBE9DF url(../img/center.png) no-repeat center center;
    margin:0 auto;
}	
#monopoly-frame div.level0{
    height:10%;
    width:10%;
    text-align:center;
    position:absolute;
}


/* Square background layer */

.square-start{
    background: url(../img/squares/start.gif) no-repeat center center ;
}

.square-prison{
    background: url(../img/squares/prison.gif) no-repeat center center ;
}

.square-gotoprison{
    background: url(../img/squares/gotoprison.gif) no-repeat center center ;
}

.square-parking{
    background: url(../img/squares/parking.gif) no-repeat center center ;
}

.square-surprise{
    background: url(../img/squares/surprise.png) no-repeat center center ;
}

.square-warning{
    background: url(../img/squares/warning.png) no-repeat center center ;
}

.square-name{
    top:0;
    font-weight: bold;
}

.square-cost{
    position: absolute;
    font-style: italic;
    top: 100;
    bottom:auto;
}

.England{
    background: url(../img/state_flags/england.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Japan{
    background: url(../img/state_flags/japan.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Canada{
    background: url(../img/state_flags/canada.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.China{
    background: url(../img/state_flags/china.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.France{
    background: url(../img/state_flags/france.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Spain{
    background: url(../img/state_flags/spain.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Germany{
    background: url(../img/state_flags/germany.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Israel{
    background: url(../img/state_flags/israel.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Italy{
    background: url(../img/state_flags/italy.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.USA{
    background: url(../img/state_flags/usa.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Brazil{
    background: url(../img/state_flags/brazil.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.Vatican{
    background: url(../img/state_flags/vatican.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.All_Transportations{
    background: url(../img/state_flags/all_transportations.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

.All_Services{
    background: url(../img/state_flags/all_services.png) no-repeat center center ;
    background-color: transparent;
    -moz-background-size:  35% !important;
    background-size: 35%;
}

#monopoly-frame div.level1{
    height:100%;
    width:100%;
    border:1px solid #000;

    -webkit-background-size: 100% 100%!important;
    -moz-background-size:  100% 100%!important;
    -o-background-size: 100% 100%!important;
    background-size:  100% 100%!important;
}

/* border of cells */

.north {
    border-bottom:1px solid #000;
}

.east {
    border-left:1px solid #000;
}

.south {
    border-top:1px solid #000;
}

.west {
    border-right:1px solid #000;
}

.north,  .northeast, .northwest {
    top:0;
}

.east, .southeast, .northeast{
    right:0;
}

.south, .southeast, .southwest {
    bottom:0;
}

.west, .southwest, .northwest {
    left:0;
}

/* position of cells */

#cell1{
    left:0;
}
#cell2{
    left:10%;
}
#cell3{
    left:20%;
}
#cell4{
    left:30%;
}
#cell5{
    left:40%;
}
#cell6{
    left:50%;
}
#cell7{
    left:60%;
}
#cell8{
    left:70%;
}
#cell9{
    left:80%;
}
#cell10{
    left:90%;
}

#cell11{
    top:10%;
}
#cell12{
    top:20%;
}
#cell13{
    top:30%;
}
#cell14{
    top:40%;
}
#cell15{
    top:50%;
}
#cell16{
    top:60%;
}
#cell17{
    top:70%;
}
#cell18{
    top:80%;
}
#cell19{
    top:90%;
}

#cell20{
    right:10%;
}
#cell21{
    right:20%;
}
#cell22{
    right:30%;
}
#cell23{
    right:40%;
}
#cell24{
    right:50%;
}
#cell25{
    right:60%;
}
#cell26{
    right:70%;
}
#cell27{
    right:80%;
}
#cell28{
    right:90%;
}
#cell29{
    top:80%;
}
#cell30{
    top:70%;
}
#cell31{
    top:60%;
}
#cell32{
    top:50%;
}
#cell33{
    top:40%;
}
#cell34{
    top:30%;
}
#cell35{
    top:20%;
}

#cell36{
    top:10%;
}



/* assets layer */


.house1 div.level2,
.house2 div.level2,
.house3 div.level2{
    background: transparent url(../img/house1.png) no-repeat center top;
}

.house2 div.level2{
    background-image:url(../img/house2.png);
}

.house3 div.level2{
    background-image:url(../img/house3.png);
}

div.level2{
    height:100%;
    -webkit-background-size: 100% 100%!important;
    -moz-background-size:  100% 100%!important;
    -o-background-size: 100% 100%!important;
    background-size:  100% 100%!important;
}
div.level3{
    height:100%;
    padding-top:30%;
}

#cell1  div.level3{
    padding-top:10%;
}


.diceFrame
{
    left: 15%;
    top: 15%;
    width: 4%;
    height: 7%;
    position:absolute;
    background-image:url(../img/cubes/6cube.png);
    background-repeat: no-repeat;
    -webkit-background-size: 100% 100%!important;
    -moz-background-size:  100% 100%!important;
    -o-background-size: 100% 100%!important;
    background-size: 100%;
}

#dice2
{
    left: 20%;
}